<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link rel="stylesheet" href="../../css/mui.min.css" />
		<link rel="stylesheet" type="text/css" href="../../css/common.css" />
		<link rel="stylesheet" href="../../css/order/orderdetails.css" />
	</head>

	<body>
		<div id="confirm" v-cloak v-show='orderSuccess'>
			<header class="mui-bar mui-bar-nav">
				<a class="mui-action-back mui-icon mui-icon-arrowleft mui-pull-left"></a>
				<h1 class="mui-title">支付订单</h1>
			</header>
			<div class="mui-content">
				<div class="payment">
					<div class="payment_img"><img src="../../images/order_mundata.png" /></div>
					<div class="order_success">订单提交成功</div>
					<div class="order_time">请在{{cancelMinsText}}内完成支付</div>
					<div class="money">支付金额 <span>¥{{orderSuccess.totalAmount}}</span></div>
				</div>
				<div class="method">
					<div class="method_title">
						请选择支付方式
					</div>
					<div>
						<div class="balance">
							<ul class="mui-table-view">
								<li class="mui-table-view-cell">零钱支付</li>
							</ul>
							<div class="available">
								<!--class="check"-->
								<div @tap="smallChangeTap(0)"><i :class="{check :smallChange==0}"></i>使用预存款支付(可用余额：<span>¥{{orderSuccess.availablePredeposit}}</span>)</div>
								<div @tap="smallChangeTap(1)" style="display: none;"><i :class="{check :smallChange==1}"></i>使用金币支付(可用余额：<span>¥{{orderSuccess.coin}}</span>)</div>
								<div class="password">
									<div>
										<span>请输入支付密码：</span>
										<div class="go_payment">
											<input type="password" placeholder="输入支付密码" class="password_input" :class="{event :mixedPayment}" />
											<button type="button" class="mui-btn mui-btn-primary determine" @tap="determinePay">{{determineText}}</button>
											<div class="nopassword">还没有设置密码？<span class="clsopen" href='setpassword.html'>马上设置</span></div>
										</div>
									</div>
								</div>
							</div>
						</div>
						<div class="thirdrelease">
							<ul class="mui-table-view">
								<!--<li class="mui-table-view-cell wei">微信支付</li>
								<li class="mui-table-view-cell alipay">支付宝支付</li>-->
								<li class="mui-table-view-cell" @tap="paymentTap(channels)" v-for="channels in channels" :class="channels.id == 'wxpay' ? 'wei' : 'alipay'" v-text="channels.id == 'wxpay' ? '微信支付' : '支付宝支付'">微信支付</li>
							</ul>
						</div>
					</div>
				</div>
			</div>
		</div>
		<script src="../../js/mui.min.js"></script>
		<script src="../../js/libs/zepto.js"></script>
		<script src="../../js/libs/vue.js"></script>
		<script src="../../js/common.js"></script>
		<script type="text/javascript">
			mui.init({
			})

			mui.plusReady(function() {
				if(plus.webview.getWebviewById('../order/confirmorder.html')) {
					plus.webview.getWebviewById('../order/confirmorder.html').close('none')
				}

				var swith = false

				var confirm = new Vue({
					el: '#confirm',
					data: {
						cancelMins: 0,
						cancelMinsText: 0,
						orderSuccess: '',
						determineText: '确定支付',
						//零钱支付
						//0预存款,1金币
						smallChange: -1,

						//支付通道
						channels: [],
						subIds: '',
						//						判断混合支付
						mixedPayment: false
					},
					watch: {
						cancelMins: function(news, old) {
							this.cancelMinsText = secToTime(news)
						}
					},
					methods: {
						smallChangeTap: function(index) {
							if(confirm.mixedPayment) {
								return
							}
							if(index == 0 && confirm.orderSuccess.availablePredeposit <= 0) {
								common.toast('预存款不足')
								return
							} else if(index == 1 && confirm.orderSuccess.coin <= 0) {
								common.toast('金币不足')
								return
							}
							//index0预存款,1金币
							if(confirm.smallChange == index) {
								confirm.smallChange = -1
							} else {
								confirm.smallChange = index
							}
							if(confirm.smallChange >= 0) {
								if(confirm.orderSuccess.availablePredeposit < confirm.orderSuccess.totalAmount && confirm.smallChange == 0) {
									confirm.determineText = '组合支付'
								} else if(confirm.orderSuccess.coin < confirm.orderSuccess.totalAmount && confirm.smallChange == 1) {
									confirm.determineText = '组合支付'
								} else {
									confirm.determineText = '确定支付'
								}
							} else {
								confirm.determineText = '确定支付'
							}
						},
						//微信货支付宝
						paymentTap: function(dataCls) {
							if(swith) {
								return
							}
							var subIds = confirm.subIds.toString()
							swith = true
							var payTypeId = dataCls.id == 'wxpay' ? 'WEIXIN_PAY_APP' : 'ALP_APP'
							//判断是否混合支付
							if(confirm.mixedPayment) {
								//混合支付
								//0预存款,1金币
								var mixedPayId = ''
								if(confirm.smallChange == 0) {
									mixedPayId = dataCls.id == 'wxpay' ? 'WX_APP_AND_PRED' : 'ALI_AND_PRED'
								} else {
									mixedPayId = dataCls.id == 'wxpay' ? 'WX_APP_AND_COIN' : 'ALI_AND_COIN'
								}
								console.log(mixedPayId)
								common.jsonAjax('/p/payment/mixPay', {
									subIds: subIds.split(','),
									payTypeId: mixedPayId,
									passwordCallback: 1,
									prePayTypeVal: confirm.smallChange + 1,
									password: $('.password_input').val()
								}, function(data) {
									if(data.code == 1) {
										pay(dataCls, data.data, mixedPayId)
									} else {
										swith = false
										if(data.resultMsg) {
											common.toast(data.resultMsg)
										}
									}
								})

							} else {
								common.jsonAjax('/p/payment/payto', {
									subIds: subIds.split(','),
									payTypeId: payTypeId
								}, function(data) {
									if(data.code == 1) {
										pay(dataCls, data.data)
									} else {
										swith = false
										if(data.resultMsg) {
											common.toast(data.resultMsg)
										}
									}
								})
							}
						},
						//余额或混合
						determinePay: function() {
							if(confirm.mixedPayment) {
								return
							}
							if(swith) {
								return
							} else if(confirm.smallChange < 0) {
								common.toast('请选择支付方式')
								return
							} else if(common.replace($('.password_input').val()) == '') {
								common.toast('密码不能为空')
								return
							}
							swith = true
							var subIds = confirm.subIds.toString()

							if(confirm.determineText == '确定支付') {

								common.jsonAjax('/p/payment/userPredeposit', {
									password: $('.password_input').val(),
									subIds: subIds.split(','),
									prePayTypeVal: confirm.smallChange + 1
								}, function(data) {
									if(data.code == 1) {
										if(data.data.status == 2) {
											//完成支付
											var payName = confirm.smallChange == 0 ? 'balance' : 'gold'
											var temp = {
												val: payName,
												money: confirm.orderSuccess.totalAmount,
												id: confirm.orderSuccess.firstSubNum
											}
											common.open('paymentSuccess.html', 'paymentSuccess.html', temp)
										} else {
											swith = false
											common.toast('余额不足')
										}
									} else {
										swith = false
										if(data.resultMsg) {
											common.toast(data.resultMsg)
										}
									}
								})
							} else {
								common.jsonAjax('/p/payment/checkPayPwd', {
									password: $('.password_input').val(),
								}, function(data) {
									swith = false
									if(data.code == 1) {
										$("input").blur()
										common.toast('余额扣款成功，请选择第三方组合')
										//0预存款,1金币
										confirm.mixedPayment = true
										if(confirm.smallChange == 0) {
											confirm.orderSuccess.totalAmount -= confirm.orderSuccess.availablePredeposit
											confirm.orderSuccess.totalAmount = confirm.orderSuccess.totalAmount.toFixed(2)
											confirm.orderSuccess.availablePredeposit = 0
										} else {
											confirm.orderSuccess.totalAmount -= confirm.orderSuccess.coin
											confirm.orderSuccess.totalAmount = confirm.orderSuccess.totalAmount.toFixed(2)
											confirm.orderSuccess.coin = 0
										}
									} else {
										if(data.resultMsg) {
											common.toast(data.resultMsg)
										}
									}
								})
							}
						}
					}
				})
				var self = plus.webview.currentWebview();
				confirm.subIds = self.parameter

				common.ajax('/submitOrder/orderSuccess', {
					subNums: confirm.subIds
				}, function(data) {
					if(data.code == 1) {
						confirm.cancelMins = data.data.cancelMins
						confirm.orderSuccess = data.data
						down()
					} else {
						if(data.resultMsg) {
							common.toast(data.resultMsg)
						}
					}
				})

				function down() {
					if(confirm.cancelMins <= 0) {
						mui.back()
					} else {
						confirm.cancelMins--
							setTimeout(down, 1000)
					}
				}

				// 获取支付通道
				plus.payment.getChannels(function(channels) {
					for(var i in channels) {
						if(channels[i].id == 'wxpay' || channels[i].id == 'alipay') { // 过滤掉不支持的支付通道：暂不支持360相关支付
							confirm.channels.unshift(channels[i])
						}
					}
					//					console.log(confirm.channels)
				}, function(e) {
					mui.toast('获取支付通道失败：' + e.message);
				});

				/*时间格式*/
				var secToTime = function(s) {
					var t;
					if(s > -1) {
						var hour = Math.floor(s / 3600);
						var min = Math.floor(s / 60) % 60;
						var sec = s % 60;
						if(hour < 10) {
							t = '0' + hour + "时";
						} else {
							t = hour + "时";
						}

						if(min < 10) {
							t += "0";
						}
						t += min + "分";
						if(sec < 10) {
							t += "0";
						}
						t += sec.toFixed(0) + '秒';
					}
					return t;
				}
				//微信支付或支付宝支付
				// 支付
				function pay(id, data, mixedPayId) {
					var paydata = id.id == 'wxpay' ? JSON.stringify(data) : data
					console.log(paydata)
					plus.payment.request(id, paydata, function(result) {
						var temp = {}
						if(mixedPayId) {
							temp = {
								val: '混合支付',
								money: confirm.orderSuccess.totalAmount,
								id: confirm.orderSuccess.firstSubNum
							}
						} else {
							temp = {
								val: id.id,
								money: confirm.orderSuccess.totalAmount,
								id: confirm.orderSuccess.firstSubNum
							}
						}

						common.open('paymentSuccess.html', 'paymentSuccess.html', temp)
					}, function(e) {
						swith = false
						common.toast('----- 支付失败 -----');
					});
				}

				$(document).on('input', '.password_input', function() {
					var c = $(this);
					if(/[^\d]/.test(c.val())) { //替换非数字字符    
						var temp_amount = c.val().replace(/[^\d]/g, '');
						$(this).val(temp_amount);
						common.toast('请输入6位数字密码')
					}
					if($(this).val() > 6) {
						$(this).val($(this).val().slice(0, 6))
					}
				})

			})
		</script>
	</body>

</html>